<template>
  <van-nav-bar title="订单详情" left-arrow @click-left="back" />
  <section class="aui-flexView">
    <!-- 订单详细 -->
    <section class="aui-scrollView">
      <!-- 订单状态 -->
      <div class="aui-pay-change">
        <div class="aui-flex">
          <div class="aui-flex-box">
            <h3>{{ info.status_text }}</h3>
          </div>
          <div class="aui-pay-zfb">
            <img src="/assets/images/icon-zfb.png" alt="" />
          </div>
        </div>
      </div>
      <!-- 收货地址 -->
      <div class="aui-flex">
        <div class="aui-flex-add">
          <img :src="business.avatar_text" alt="" />
        </div>
        <div class="aui-flex-box">
          <h3>
            {{ info.address.consignee }} <em>{{ info.address.mobile }}</em>
          </h3>
          <p>{{ info.address.region_text }} {{ info.address.address }}</p>
        </div>
      </div>
      <!-- 物流信息 -->
      <van-steps direction="vertical" :active="0">
        <van-step v-for="(item,index) in expresslist" :key="index">
          <h3>{{ item.status }}</h3>
          <p>{{ item.time }}</p>
        </van-step>
      </van-steps>
    </section>
  </section>
</template>
<script setup>
const { proxy } = getCurrentInstance();
const back = () => proxy.$router.push("/order/index");
let business = proxy.$cookies.get("business") ? proxy.$cookies.get("business") : {};
business = reactive(business);
let orderid = proxy.$route.query.hasOwnProperty("orderid")
  ? proxy.$route.query.orderid
  : 0;
orderid = ref(orderid);
const info = ref({
  address: {},
});
const expresslist = ref([]);
onBeforeMount(() => {
  getInfoData();
  getExpressData();
});
const getInfoData = async () => {
  let result = await proxy.$POST({
    url: "/order/info",
    params: {
      orderid: orderid.value,
      busid: business.id
    },
  });
  if (result && result.code == 1) {
    info.value = result.data;
  }
};

const getExpressData = async () => {
  let result = await proxy.$POST({
    url: "/order/express",
    params: {
      orderid: orderid.value,
      busid: business.id,
    },
  });
  if (result && result.code == 1) {
    // 数据倒转
    expresslist.value = result.data.reverse();
  }
};
</script>
<style>
@import url("/assets/css/info.css");
</style>
